<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html  xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title th:text="${#themes.code('cas.page.title')}"></title>
    <link rel="icon" href="images/pig.ico" type="images/x-ico" />
    <link rel="stylesheet" th:href="@{${#themes.code('cas.myself2.css')}}"/>
    <script th:src="@{${#themes.code('cas.javascript.file')}}"></script>
    <!--资源加载不全，设置加载页面刷新一次-->
    <script type="text/javascript">
        function refresh(){
            url = location.href;
            console.log(url);
            var once = url.split("#");
            if (once[1] != 1) {
                url += "#1";
                self.location.replace(url);
                window.location.reload();
            }
        }
        setTimeout('refresh()', 1000);
    </script>


</head>

<body>
<div class="login_main" style="text-align: center ; ">
    <div>
    <form method="post" th:object="${credential}">
        <div th:if="${#fields.hasErrors('*')}">
            <span th:each="err : ${#fields.errors('*')}" th:utext="${err}" style="color: red" />
        </div>
        <div  class="user_signal" style="background: none;position: relative;top: -10px;left: 680px;width: 80px;height: 80px;border-radius: 50%;border: 3px solid rgba(255,255,255,0.3)">
        <img src="images/head-user-photo.png" style="border-radius: 50%;background-size: cover;width: 100%;height: 100%;left: 0;top: 0"/>
        </div>

        <section >
            <div th:unless="${openIdLocalId}" class="formLi" style="line-height: 40px; margin-bottom: 12px;border-radius: 16px;background: #333333;opacity: 0.3;width: 300px;height: 38px;position: absolute;left: 570px;top: 100px">
                <img src="images/user.png" class="iconimg" style="padding-right: 8px; margin-top: 8px;width: 20px; border-right: 1px solid #dee5e7"/>
                <input style="border: none;color: white" class="required" id="username" size="25" tabindex="1" type="text"
                       th:disabled="${guaEnabled}"
                       th:field="*{username}"
                       th:accesskey="#{screen.welcome.label.netid.accesskey}"
                       autocomplete="off"
                       th:value="admin" />
            </div>
        </section>

        <section >
            <div class="formLi" style="margin-bottom: 12px;border-radius: 16px;background: #333333;opacity: 0.3;width: 300px;height: 38px;position: absolute;left: 570px;top: 158px">
                <img src="images/pasword.png" class="iconimg" style="padding-right: 8px; margin-top: 8px; width: 20px;border-right: 1px solid #dee5e7"/>
                <input style="border: none;color: white" class="required" type="password" id="password" size="25" tabindex="2"
                       th:accesskey="#{screen.welcome.label.password.accesskey}"
                       th:field="*{password}"
                       autocomplete="off"
                       th:value="111111" />
            </div>
        </section>

        <section>
            <input type="hidden" name="execution" th:value="${flowExecutionKey}" />
            <input type="hidden" name="_eventId" value="submit" />
            <input type="hidden" name="geolocation" />
            <input class="btn btn-submit btn-block" name="submit" accesskey="l" th:value="#{screen.welcome.button.login}" tabindex="6" type="submit" style="font-weight: bold;font-family: 微软雅黑 ; font-size:10px ;border: none; border-radius: 25px; background: #EEEEEE;width: 80px;height: 30px;position: absolute;left: 670px;top: 258px" />
        </section>
    </form>
</div>
</div>
</body>
</html>